import 'dart:ui';

import 'package:buy_flutter/common/Application.dart';
import 'package:buy_flutter/common/sp/UserSharePreference.dart';
import 'package:buy_flutter/net/bean/UserInfoBean.dart';
import 'package:buy_flutter/page/main/bloc/main_bloc.dart';
import 'package:buy_flutter/router/routes.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

class MainRightView extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _MainRightState();
  }
}

class _MainRightState extends State {
  final String headerUrl =
      "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1950846641,3729028697&fm=26&gp=0.jpg";
  final List<Widget> slives = [];
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: BlocBuilder<MainBloc, MainState>(
        buildWhen: (s, c) {
          try {
            if (c != null &&
                c.userInfoBean != null &&
                c.userInfoBean.data != null) {
              return true;
            }
          } catch (e) {
            return false;
          }
          return false;
        },
        builder: (context, state) {
          return Container(
            color: Colors.white,
            padding: EdgeInsets.symmetric(horizontal: 15),
            child: SingleChildScrollView(
              child: Column(
                children: [
                  _headerView(state.userInfoBean.data),
                  _containerView(state.userInfoBean.data),
                  _userGroup(state.userInfoBean.data),
                ],
              ),
            ),
          );
        },
      ),
    );
  }

  Widget _headerView(UserInfo userInfo) {
    return Container(
      color: Colors.white,
      padding: EdgeInsets.only(top: 10, right: 10),
      child: Row(
        children: [
          ClipOval(
            child: Image.network(
              headerUrl,
              width: 50,
              height: 50,
            ),
          ),
          Expanded(
            child: Container(
              margin: EdgeInsets.only(left: 10),
              width: double.infinity,
              alignment: Alignment.centerLeft,
              height: 50,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    "欢迎回来",
                    maxLines: 1,
                    style: TextStyle(color: Colors.black, fontSize: 14),
                  ),
                  Text(
                    "小朋友相片",
                    maxLines: 1,
                    style: TextStyle(
                        color: Color(0xFF3FADA9),
                        fontWeight: FontWeight.bold,
                        fontSize: 18),
                  ),
                ],
              ),
            ),
          ),
          _loginoutView(),
        ],
      ),
    );
  }

  Widget _containerView(UserInfo userInfo) {
    return Container(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _userChildInfo(userInfo),
          _userInfo(userInfo),
        ],
      ),
    );
  }

  Widget _userChildInfo(UserInfo userInfo) {
    DateTime birthDateTime = DateTime.fromMillisecondsSinceEpoch(
        int.parse(userInfo.birthday) * 1000);
    var age = (DateTime.now().difference(birthDateTime).inDays / 365).ceil();
    return Container(
      color: Colors.white,
      margin: EdgeInsets.only(top: 10),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "小朋友資料",
            style: TextStyle(
                color: Color(0xFF010101),
                fontSize: 18,
                fontWeight: FontWeight.bold),
          ),
          _infoName("姓名", userInfo.name),
          _infoName("生日日期",
              "${birthDateTime.year}-${birthDateTime.month}-${birthDateTime.day}"),
          _infoName("年齡", age.toString()),
        ],
      ),
    );
  }

  Widget _userInfo(UserInfo userInfo) {
    return Container(
      color: Colors.white,
      margin: EdgeInsets.only(top: 15),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "家长资料",
            style: TextStyle(
                color: Color(0xFF010101),
                fontSize: 18,
                fontWeight: FontWeight.bold),
          ),
          _infoName("電郵", userInfo.email),
          _infoName("電話", userInfo.mobile),
        ],
      ),
    );
  }

  Widget _infoName(String label, String content) {
    return Container(
      margin: EdgeInsets.only(top: 10),
      padding: EdgeInsets.symmetric(vertical: 10, horizontal: 15),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(4),
        color: Color(0xFFE5F8F7),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            label,
            style: TextStyle(color: Colors.black, fontSize: 16),
          ),
          Expanded(
            child: Text(
              content,
              textAlign: TextAlign.right,
              style: TextStyle(color: Color(0xff5a5a5a), fontSize: 16),
            ),
          ),
        ],
      ),
    );
  }

  Widget _infoGroup(String label, String content, bool isBuy) {
    return Container(
      margin: EdgeInsets.only(top: 10),
      height: 40,
      padding: EdgeInsets.symmetric(horizontal: 15),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(20),
        color: isBuy ? Color(0xFFFFE5B8) : Color(0xFFE2E2E2),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            label,
            style: TextStyle(color: Colors.black, fontSize: 16),
          ),
          Expanded(
            child: Text(
              content,
              textAlign: TextAlign.right,
              style: TextStyle(color: Color(0xff5a5a5a), fontSize: 16),
            ),
          ),
        ],
      ),
    );
  }

  Widget _userGroup(UserInfo userInfo) {
    List<Widget> childrens = [
      Text(
        "專屬房間編號",
        style: TextStyle(
          color: Color(0xFF010101),
          fontSize: 18,
        ),
      )
    ];
    List<UserInfoUnit> userInfoUnits = userInfo.result;
    for (int i = 0; i < userInfoUnits.length; i++) {
      UserInfoUnit item = userInfoUnits[i];
      childrens.add(_infoGroup("${item.title}階段",
          item.status ? item.classroomid.toString() : "", item.status));
    }
    return Container(
      color: Colors.white,
      margin: EdgeInsets.only(top: 15, bottom: 15),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: childrens,
      ),
    );
  }

  Widget _loginoutView() {
    return Container(
      child: ElevatedButton(
        onPressed: () {
          UserSharePreference.clear();
          Application.router
              .navigateTo(context, Routes.welcome, clearStack: true);
        },
        child: Text("登出"),
        style: ButtonStyle(
            minimumSize: MaterialStateProperty.all(Size(60, 30)),
            shape: MaterialStateProperty.all(
              RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
            )),
      ),
    );
  }

}
